<template>
	<view class="all_content">
		<view class="top_nav" @click="back()">
			<image src="../../static/img/arrow-left.png" mode=""></image>
			<p>全部应用</p>
		</view>
		<view class="footer">
			<!-- 常用应用 -->
			<view class="icons">
				<view class="i_title">常用应用</view>
				<view class="i_items">
					<view class="i_item">
						<navigator url="">
							<image src="../../static/img/calendar.png" mode=""></image>
							<p>我的考勤</p>
						</navigator>
					</view>
					<view class="i_item">
						<navigator url="">
							<image src="../../static/img/card.png" mode=""></image>
							<p>一卡通</p>
						</navigator>
					</view>
					<view class="i_item">
						<navigator url="">
							<image src="../../static/img/performance.png" mode=""></image>
							<p>我的绩效</p>
						</navigator>
					</view>
				</view>
			</view>
			<!-- 薪酬福利 -->
			<view class="icons">
				<view class="i_title">薪酬福利</view>
				<view class="i_items">
					<view class="i_item">
						<navigator url="">
							<image src="../../static/img/user-heart-green.png" mode=""></image>
							<p>企业年金</p>
						</navigator>
					</view>
					<view class="i_item">
						<navigator url="">
							<image src="../../static/img/salary.png" mode=""></image>
							<p>薪酬查询</p>
						</navigator>
					</view>
					<view class="i_item">
						<navigator url="">
							<image src="../../static/img/user-follow.png" mode=""></image>
							<p>弹性福利</p>
						</navigator>
					</view>
				</view>
			</view>
			<!-- 人事合同 -->
			<view class="icons">
				<view class="i_title">人事合同</view>
				<view class="i_items">
					<view class="i_item">
						<navigator url="">
							<image src="../../static/img/star-smile.png" mode=""></image>
							<p>转正申请</p>
						</navigator>
					</view>
					<view class="i_item">
						<navigator url="">
							<image src="../../static/img/user-heart.png" mode=""></image>
							<p>津贴申请</p>
						</navigator>
					</view>
					<view class="i_item">
						<navigator url="">
							<image src="../../static/img/user-location.png" mode=""></image>
							<p>证明申请</p>
						</navigator>
					</view>
					<view class="i_item">
						<navigator url="">
							<image src="../../static/img/user-star.png" mode=""></image>
							<p>合同续签</p>
						</navigator>
					</view>
					<view class="i_item">
						<navigator url="">
							<image src="../../static/img/user-line.png" mode=""></image>
							<p>辞职申请</p>
						</navigator>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {};
	},
	methods: {
		back() {
			uni.navigateBack({ delta: 1 });
		}
	}
};
</script>

<style lang="less">
.i_title {
	font-size: 32rpx;
	color: #101010;
	font-weight: 600;
}
.all_content {
	width: 100%;
	height: 100%;
	.top_nav {
		width: 100%;
		height: 100rpx;
		background-color: #007aff;
		padding: 20rpx;
		box-sizing: border-box;
		display: flex;
		image {
			width: 58rpx;
			height: 58rpx;
		}
		p {
			color: #fff;
			font-size: 34rpx;
			margin: 6rpx 0 0 10rpx;
		}
	}
	.footer {
		width: 100%;
		padding: 50rpx 30rpx 30rpx;
		box-sizing: border-box;
		.icons {
			width: 100%;
			.i_items {
				width: 100%;
				margin: 40rpx 0 0 0;
				display: flex;
				justify-content: flex-start;
				flex-wrap:wrap;
				text-align: center;
				.i_item {
					width: 25%;
					margin: 0 0 50rpx 0;
					image {
						width: 50rpx;
						height: 50rpx;
					}
					p {
						font-size: 24rpx;
						color: #101010;
						margin-top: 5rpx;
					}
				}
			}
		}
	}
}
</style>
